<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>成语接龙</title>

    <link rel="stylesheet" type="text/css" href="/static/js/layui-v2.5.7/layui/css/layui.css">
    <script type="text/javascript" src="/static/js/layui-v2.5.7/layui/layui.js"></script>
    <script type="text/javascript" src="/static/js/myJs.js"></script>

</head>
<body>

<div class="layui-form-item">
    <label class="layui-form-label">成语接龙</label>
    <div class="layui-input-inline">
        <input type="text" name="wd" id="wd" lay-verify="required" placeholder="请输入成语" autocomplete="off"
               class="layui-input">
    </div>
    <div class="layui-input-inline">
        <input type="number" name="size" id="size" min=0 placeholder="成语数量" style="width:110px"
               class="layui-input">
    </div>
    <button class="layui-btn" data-type="reload" onclick="submit()">立即提交</button>
    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>


<div>
    <table class="layui-table" id="test">
        <thead></thead>
        <tbody id="Jielong">


        </tbody>
    </table>
</div>


<script>
    layui.use(['form', 'laydate', 'table'], function () {
        var form = layui.form;
        window.laydate = layui.laydate;
        window.table = layui.table;


    })


    function submit() {
        $.ajax({
            dataTYpe: 'json',
            url: '/studentLayer/Jielong/ajaxJielong',
            type: 'get',
            data: {
                wd: $("#wd").val(),
                size: $("#size").val()
            },
            success: function (date) {

                // console.log(date);
                //对返回的字符串进行在编码，这样才能真正的转化为json格式
                var dateJson = JSON.parse(date);

                console.log(dateJson.result.data);
                var html ="";
               dateJson.result.data.forEach(function (index, value) {
                    html = html +"<tr>" + "<td>" + index + "</td>>" + "</tr>";

                })
                $("#Jielong").html(html);
                // window.table.reload("");


            }
        })
    }


</script>


</body>
</html>